<!--

Paleta de cores: (fonte colorschemer.com/online.html)
CCCCFF tons de roxo a rosa
E6CCFF
FFCCFF
FFCCE6 ..../
CCE6FF azul cinza
8F8FFF roxo leve
5252FF azul forte
FFCCCC semi laranja
CCFFFF azul ciano leve
FFFF52 amarelo forte
FFFF8F amarelo fraco
FFE6CC
CCFFE6 tons de verde a amarelo aguado
CCFFCC
E6FFCC
FFFFCC ..../


-->

<html>
<head>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
</head>

<style>
body {
font-family: sans-serif;
margin: 0px;
background-color: #FFFFFF;
}

#mp-title {
font-size: 18px;
padding-top: 8px;
padding-left: 8px;
padding-bottom: 12px;
z-index: 1;
position: fixed;
top: 0px;
width: 100%;
background-color: #E6FFCC;
}

#mp-wrapper {
z-index: 0;
margin-top: 39px;
//border: 1px solid black;
height: 100%;
border-top: 5px solid #CCE6FF;
}

#mp-panel-left {
z-index: 1;
border-right: 2px solid #CCE6FF;
border-bottom: 2px solid #CCE6FF;
height: 100%;
position: fixed;
float: left;
width: 308px;
}

#mp-panel-main {
position: absolute;
left: 310px;
//font-size: px;
font-family: serif;
</style>

<body>
<div id="mp-wrapper">
<div id="mp-title">
<b>Minerpad</b>
</div>

<!-- -->
<div id="mp-panel-left">
left
<button id="mp-cmd-new-tab">new tab</button>
</div> <!-- mp-panel-left -->

<div id="mp-panel-main">

</div> <!-- mp-panel-main -->

</div> <!-- mp-wrapper -->


<div id="debug-text-fragment1">
 
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed risus dui, bibendum eget cursus et, consectetur ut arcu. Aenean convallis eros eu nulla ultrices molestie. Vivamus eu arcu vel neque bibendum mollis. Pellentesque ultricies massa at urna vestibulum eu mattis tortor posuere. Praesent tellus urna, convallis ut auctor sed, egestas tincidunt felis. Donec aliquet ligula vel ipsum euismod vel suscipit libero fermentum. Donec vel nibh ante. Nunc eu nibh velit.

Curabitur libero leo, sodales id scelerisque eu, semper et tellus. Aenean ultrices, turpis a tempor volutpat, odio libero blandit enim, sit amet rhoncus nisl nisl eu ligula. Nullam elementum urna ut neque porta viverra. Nulla facilisi. Nunc a lorem odio. Integer condimentum placerat lorem sit amet tempor. Sed velit lacus, dignissim at fringilla sed, bibendum vitae tortor. Quisque eget quam dui.

Phasellus imperdiet consectetur convallis. Ut malesuada mollis neque, sed molestie metus tempus sit amet. Quisque venenatis nunc eget magna ornare ullamcorper. Aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla posuere lorem a nunc pellentesque quis rhoncus dolor egestas. In venenatis scelerisque sodales. Aenean nisl tortor, porttitor et ultrices quis, laoreet in tortor.

Ut lobortis mi ante. Cras magna lorem, ornare sed laoreet non, hendrerit eu orci. Etiam tempor ante sodales nulla eleifend adipiscing ut id erat. Aliquam sagittis scelerisque consectetur. Phasellus sollicitudin vehicula molestie. Nulla lorem sem, iaculis vel tristique vitae, vulputate quis nibh. Morbi turpis elit, pretium eu tristique sed, porttitor at dui.

Nunc sollicitudin nunc ac augue interdum lacinia. Aliquam auctor pulvinar est, luctus congue neque tincidunt vitae. Phasellus fringilla, lacus a vulputate eleifend, justo eros cursus libero, nec bibendum neque turpis ut augue. Suspendisse sed erat metus. Quisque enim lacus, eleifend quis condimentum id, luctus et nunc. Aliquam erat volutpat. Donec sodales odio nec massa accumsan sed cursus sapien eleifend. Donec sed lectus nunc. Duis vehicula, erat eget mattis dictum, lacus est rhoncus justo, ut bibendum magna orci aliquet nisl. Morbi vulputate mi eget risus vulputate feugiat. Vivamus sit amet magna risus. Vivamus quis libero ut massa sagittis condimentum eu id metus. Quisque pretium vehicula ligula, vitae faucibus ante facilisis ut. Integer metus lorem, sodales ut placerat non, vulputate eget mi.

Morbi mollis euismod diam aliquet dapibus. Praesent convallis hendrerit sapien eget rhoncus. Integer eget ante sed nulla consequat fringilla. Vestibulum eleifend turpis sed lectus pellentesque ac tincidunt libero luctus. Quisque imperdiet purus sed odio scelerisque eget vestibulum quam bibendum. Donec dignissim nulla ac purus tempus pretium. Donec sit amet lectus lectus, eu tincidunt mi. Vestibulum ut velit sapien. Phasellus vel lacus est. Etiam sit amet enim scelerisque ante dignissim mollis nec a massa. Sed feugiat sollicitudin libero, id fringilla arcu suscipit et. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Donec in urna odio, eget lobortis sem.

Aliquam velit elit, facilisis ac viverra at, euismod id diam. Praesent quis augue est, in consequat nibh. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Donec ut nibh lorem, adipiscing ornare libero. Integer ultrices lacus quis ante ultrices aliquet. Pellentesque felis magna, fermentum in bibendum at, dapibus at lacus. In ac nisi dolor, a convallis dolor. Aenean non orci at lorem vulputate mattis. Sed at odio sit amet nisi pulvinar congue sed sit amet arcu. Sed dapibus congue eros vitae tempus. Vivamus scelerisque, leo a feugiat pulvinar, lorem quam egestas mauris, bibendum commodo tellus nunc et mi. Etiam rhoncus sem a lectus faucibus suscipit. Morbi commodo rhoncus urna, sed mollis neque cursus non. Pellentesque in arcu metus. Donec dui erat, vestibulum dapibus convallis a, feugiat at lorem.

Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Duis sed tortor est. Morbi varius blandit sapien, at iaculis libero rhoncus eget. Donec consectetur malesuada laoreet. Praesent tortor velit, porta eget pulvinar id, facilisis vitae elit. Vestibulum porttitor, augue bibendum ornare viverra, metus velit ornare tortor, eu tempor ligula quam tincidunt urna. Curabitur placerat pulvinar sem, accumsan feugiat mauris pretium ac. Integer adipiscing elementum urna, in malesuada justo tempor quis. Curabitur pretium lorem vel nibh auctor non rutrum felis hendrerit. Donec volutpat imperdiet velit sed pharetra. Vivamus non scelerisque ante. Integer ultrices, risus id porttitor feugiat, odio tellus gravida lorem, eget vestibulum tortor tellus iaculis dui. Vivamus metus augue, molestie ac tincidunt sit amet, congue eu mauris. Cras et neque non tellus mattis auctor. Sed metus tellus, tincidunt eget auctor interdum, molestie sed risus.

Ut nibh ante, mattis non facilisis in, cursus vel est. Nulla vel turpis dolor, nec ultrices nisi. Donec elementum ligula pulvinar odio accumsan ac posuere risus hendrerit. Fusce adipiscing mi ac enim elementum ac placerat ligula euismod. Maecenas tempus molestie quam eu aliquam. Ut id tellus sit amet quam congue vehicula. Aenean eget vehicula tortor. Maecenas id est quis orci mattis placerat. Donec elementum, urna vel dignissim placerat, nisi sapien pretium dui, ac faucibus nulla felis in purus. Ut mi nibh, consequat id varius eget, blandit sed massa. Fusce sem ipsum, tincidunt in pulvinar non, rutrum et diam. Donec vel lectus quis magna luctus volutpat at non est. Mauris ultrices, urna quis iacu

</div>

</body>



<script>
//<!-- UI init ->
var $tabs;
$('document').ready(function () {
    $tabs = $('#mp-panel-main').tabs();

    $('#mp-cmd-new-tab').click (function () {
        alert ('lalala');
        $tabs.tabs ('add', 'http://google.com', 'new tab!');

    });

});
</script>

</html>
